(function () {
    $.fn.extend({
        innerht(){
            var pid=location.search.split("?")[1].split("=")[1];
        $.ajax({
            url:`account/search/${pid}`
        }).then(function (response){
            var str=``;
            str=`
            <div class="main_nav_wrap">
            <div class="main_nav width">
                <div class="all_kinds">
                    <h2 class="headi">全部商品分类</h2>
                </div>
                <div class="nav_v">
                    <ul class="nav">
                        <li class="">
                            <a href="http://gz.womai.com/" target="_blank" id="_gatrack_event_topnav_1"
                                data-ga="top-nav" data-gatext="首页" class="title"
                                name="_AD_home_2016_header_menu_1">首页</a>

                            <div class="nav_cont" style="display: none;"></div>
                        </li>
                        <li class="">
                            <a href="https://tuan.womai.com/tuan/productlist.do?cityid=31346&amp;mid=200"
                                target="_blank" id="_gatrack_event_topnav_2" data-ga="top-nav" data-gatext="团购"
                                class="title" name="_AD_home_2016_header_menu_2">团购</a>
                            <div class="nav_cont" style="display: none;"></div>
                        </li>
                    </ul>
                </div>
                <div class="btn">
                    <span class="cart-icon png">
                    </span>
                    <span class="text"> 购物车</span>
                </div>
            </div>
        </div>
        <div class="w crumbs">
            <a href="">食品</a> &gt; <a href="">进口食品</a>
            &gt; <a href="">进口饼干/糕点</a> &gt; <a href="">进口曲奇</a> &gt; <a href="">其他 </a> &gt; <a class="last"
                href="">${response.pName}</a>
        </div>
        <div class="wrap w">
            <div class="details-left fl">
                <div class="infor-wrap">
                    <div class="infor-wrap-l fl">
                        <div class="middleimg"><img src="${response.middleImgs[0]}" alt="">
                            <div class="middleArea"></div>
                        </div>
                        <div class="bigArea"><img class="bigimg" src="${response.bigImgs[0]}" alt=""></div>
                        <div class="item">
                            <ul>
                                <li><a href=""></a><img src="${response.smallImgs[0]}" alt=""></li>
                                <li><a href=""></a><img src="${response.smallImgs[1]}" alt=""></li>
                                <li><a href=""></a><img src="${response.smallImgs[2]}" alt=""></li>
                                <li><a href=""></a><img src="${response.smallImgs[3]}" alt=""></li>
                                <li><a href=""></a><img src="${response.smallImgs[4]}" alt=""></li>
                                <li><a href=""></a><img src="${response.smallImgs[5]}" alt=""></li>
                            </ul>
                        </div>
                    </div>
                    <div class="infor-wrap-r fr">
                        <div class="pro_tit_top" title="${response.pName}">
                            <h1 class="p-title" title="${response.pName}">${response.pName}</h1>
                        </div>
                        <div id="protopbillingDiv">
                            <div class="pro_billing">
                                特惠品部分卡券不可使用；全球购不支持使用我买卡
                            </div>
                        </div>
                        <div class="price-wrap">
                            <div class="price-infor"><span class="fr time" id="specialPriceTimersy"></span>
                                <span class="price" id="buyPrice"><em>￥</em><em>${response.pPrice}</em></span><span
                                    class="group pro_m_tit_1">零售价</span><a
                                    onclick="priceNotice(200,715458)">(降价通知)</a>
                            </div>
                        </div>
                        <div id="loadRegion">
                            <div class="delivery-tip">送至:</div>
                            <div class="addr_select">湖南省长沙市芙蓉区</div>
                        </div>
                        <div class="choose">
                            <dl>
                                <dt>数量：</dt>
                                <dd>
                                    <div class="choose-amount">
                                        <span class="input_minus fl">-</span>
                                        <input id="amount" type="text" class="proinput fl" value="1">
                                        <span class="input_plus fr">+</span>
                                    </div>
                                </dd>
                            </dl>
                        </div>
                        <div class="btn-box">
                            <div class="btn-qr bar-code">加入购物车</div>
                            <div class="coupon-phone btn">扫一扫下单</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
            `
            $(".body").html(str)
            $(".tolwidth").tol()
        })
        }
,
        tol(){
            var pid=location.search.split("?")[1].split("=")[1];
            $.ajax({
                url:`account/search/${pid}`
            }).then(function (response){
                var copyObj=Object.assign({}, response)
                delete copyObj.bigImgs;
                delete copyObj.middleImgs;
                delete copyObj.smallImgs;
               console.log(JSON.stringify(copyObj));
               console.log(copyObj);
                $(".btn-qr").attr("data-info",JSON.stringify(copyObj))

            var scale = $(".middleimg").width() / $(".bigimg").width()
            $(".wrap").find(".middleimg").on("mouseenter", function (e) {
                var self = this;
                $(".bigArea").show();
                $(".middleArea").show();
                w = $(".bigArea").width() / $(".bigimg").width() * $(".middleimg").width();
                h = $(".bigArea").height() / $(".bigimg").height() * $(".middleimg").height();
    
                $(".middleArea").css({
                    width: w,
                    height: h
                })
    
            })
            $(".middleimg").on("mousemove", function (e) {
                var disX = e.pageX - $(".infor-wrap-l").offset().left - $(".middleArea").width() / 2;
                var disY = e.pageY - $(".infor-wrap-l").offset().top - $(".middleArea").height() / 2;
                if (disX < 0) {
                    disX = 0
                }
                if (disX > $(this).width() - $(".middleArea").width()) {
                    disX = $(this).width() - $(".middleArea").width()
                }
                if (disY < 0) {
                    disY = 0
                }
                if (disY > $(this).height() - $(".middleArea").height()) {
                    disY = $(this).height() - $(".middleArea").height()
                }
                $(".middleArea").css({
                    left: disX,
                    top: disY
                })
                $(".bigimg").css({
                    left: -disX / scale,
                    top: -disY / scale
    
                })
            }).on("mouseleave", function () {
                $(".bigArea").hide(); $(".middleArea").hide();
            })
            $(".wrap").find('.item li').on("click", function () {
                var i = $(this).index()
                $(".wrap").find(".middleimg img").attr("src", `${response.middleImgs[i]}`);
                $(".wrap").find(".bigArea img").attr("src", `${response.bigImgs[i]}`);
            })
            let flag = false;
            $(".btn-qr").on("click", function () {
                if (flag == true) {
                    return
                }
                flag = true
                var clongmidimg = $(".middleimg").find("img").clone()
                clongmidimg.appendTo($(".infor-wrap-l"))
                clongmidimg.css({
                    position: "absolute",
                    left: 0,
                    top: 0
                })
                clongmidimg.animate({
                    width: 0,
                    height: 0,
                    top: $(".wm-toolbar-tab").offset().top - $(".middleimg").offset().top,
                    left: $(".wm-toolbar-tab").offset().left
                }, 1000, function () {
                    clongmidimg.remove()
                    alert("加入购物车成功")
                    flag = false
                })
            })
            $(".input_minus").on("click", function () {
                var num = $("#amount").val()
                $("#amount").val(num - 1);
                if (num <= 0) {
                    $("#amount").val(0);
                }
    
            })
            $(".input_plus").on("click", function () {
                var num = $("#amount").val()
                $("#amount").val(Number(num) + 1);
    

            })
            $('.btn-qr').on("click", function () {
                let u_Id=JSON.parse(localStorage.getItem("avc123")||"{}").u_id;
                let number=$("#amount").val()
                var oList=Object.assign($(this).data("info"),{u_Id,number});
                console.log($(this).data("info"));
                console.log(oList);
                $.ajax({
                    url: "/account/addCart",
                    type: "POST",
                    data:oList
                }).then(function (response) {
                    layer.msg(response.msg)
                })


                $.cookie.json = true;
                if($.cookie("cart")==null||$.cookie("cart")===""){
                    var value = [{
                        name: $(".p-title").text(),
                        numb: $("#amount").val(),
                        price: $(".price").children().eq(1).text()
                    }]
                    $.cookie('cart', value, { expires: 7, path: '/'});
                    $(".suspendcart_totalamount").text($("#amount").val())
                }
                else{
                    var localData =$.cookie("cart");
                    var num=$("#amount").val();
                    localData.forEach(item => {
                        item.numb=Number(item.numb)+Number(num);
                        $.cookie('cart', localData, { expires: 7, path: '/'});
                        $(".suspendcart_totalamount").text(item.numb)
                    })
                }
            })
            $(document).on("ready",function(){
                $.cookie.json = true;
                if($.cookie("cart")==null||$.cookie("cart")===""){
                    $(".suspendcart_totalamount").text(0)
                } else{
                    var localData =$.cookie("cart");
                    var num=$("#amount").val();
                    localData.forEach(item => {
                        $.cookie('cart', localData, { expires: 7, path: '/'});
                        $(".suspendcart_totalamount").text(item.numb)
                    })
                }
            })     
        })
        }
       
})
$(function () {
            // $(".tolwidth").tol(),
            $(".tol").innerht()
})
})()